<template>
  <div class="aui-card--fill scroll-box card-box">
    <div class="pane-shell">
      <el-form :inline="true"
               @submit.native.prevent
               :model="dataForm"
               ref="dataForm"
               @keyup.enter.native="search"
               style="text-align: right">
        <el-form-item>
          <el-button @click="closeDialog()">返回</el-button>
        </el-form-item>
      </el-form>
      <el-table v-loading="dataListLoading"
                :data="dataList"
                border
                @selection-change="dataListSelectionChangeHandle"
                @sort-change="dataListSortChangeHandle"
                style="width: 100%;">
        <el-table-column prop="boardName"
                         label="平台名称"
                         header-align="center"
                         align="center">
        </el-table-column>
        <el-table-column prop="serviceAddress"
                         label="服务地址"
                         header-align="center"
                         align="center">
        </el-table-column>
        <el-table-column prop="appId"
                         label="APPID"
                         header-align="center"
                         align="center">
        </el-table-column>
        <el-table-column prop="interfaceAddress"
                         label="接口地址"
                         header-align="center"
                         align="center">
        </el-table-column>
        <el-table-column :label="$t('handle')"
                         fixed="right"
                         header-align="center"
                         align="center"
                         min-width="80">
          <template slot-scope="scope">
            <el-button type="text"
                       size="small"
                       @click="addOrUpdateHandle(scope.row)">修改</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination :current-page="page"
                     :page-sizes="[10, 20, 50, 100]"
                     :total="total"
                     layout="total, sizes, prev, pager, next"
                     @size-change="pageSizeChangeHandle"
                     @current-change="pageCurrentChangeHandle">
      </el-pagination>
    </div>
    <!-- 弹窗, 新增 / 修改 -->
    <add-or-update ref="addOrUpdate"
                   @callBack="getDataList"></add-or-update>
  </div>
</template>
<script>
import mixinViewModule from '@/mixins/view-module'
import formValidate from '@/mixins/form-validate'
import tableTemplate from '@/components/table-template'
import addOrUpdate from './platform-configuration-update.vue'
export default {
  mixins: [mixinViewModule, formValidate],
  data () {
    return {
      mixinViewModuleOptions: {
        getDataListURL: '/tb/thirdPartyBoard/queryPage',
        getDataListIsPage: true
      },
      loading: null,
      dataForm: {
      }
    }
  },
  mounted () {
    this.getDataList()
  },
  components: {
    tableTemplate,
    addOrUpdate
  },
  computed: {
  },
  methods: {
    closeDialog () {
      this.$emit('delHandle')
    },
    addOrUpdateHandle (data) {
      this.$refs.addOrUpdate.init(data)
    }
  }
}
</script>
<style lang="scss" scoped>
.user-dialog {
  background: rgba(0, 0, 0, 0.5);
}
.download {
  text-decoration: none;
  color: #fff;
}
.tree-input {
  width: 100%;
  position: relative;
  .close {
    position: absolute;
    right: 10px;
    top: 13px;
    font-size: 16px;
    color: #858585;
    cursor: pointer;
    background-color: white;
  }
}
.addBtn {
  ::v-deep .el-form-item__content {
    display: flex;
    .user-switch {
      display: flex;
      align-items: center;
      margin-right: 15px;
      .message-title {
        margin-right: 10px;
      }
    }
  }
}
.pane-shell{
  margin-top: 10px;
}
</style>
